<template>
	<div class="coupon">
		<div class="btn base-flex">
			<div class="securities">{{ item.couponMoney || '0' }}元券</div>
			<div class="url" v-copy="item.couponUrl">
				复制券链接
			</div>
		</div>
		<div class="scale">
			领券量/券总数：{{ item.couponNum - item.couponReceive }}/{{ item.couponNum }}
		</div>
		<div class="count">券剩余：{{ item.couponReceive }}</div>
		<div class="time">
			有效期：{{ item.couponStarttime | dateFormatLine }} ~
			{{ item.couponEndtime | dateFormatLine }}
		</div>
	</div>
</template>

<script>
export default {
	data() {
		return {};
	},
	props: {
		item: [Object]
	},
	mounted() {},

	methods: {}
};
</script>
<style lang="scss">
.coupon {
	text-align: left;
	color: $main-dark;
	font-size: $font12;
	.btn {
		.securities {
			background: #f14d27;
			border-radius: 12px;
			color: $color-white;
			padding: 0 15px;
			margin-right: 12px;
			@include flexBox();
		}
		.url {
			color: #4db7f3;
			border: 1px solid #4db7f3;
			padding: 0 15px;
			border-radius: 12px;
			@include flexBox();
			cursor: pointer;
		}
	}
}
</style>
